<template>
  <div>
<div class="center-conntent">
  <div class="head">
  个人中心
      <div class="homepage">
      {{ this.userInfo.Introduction}}
      <img src="https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fb-ssl.duitang.com%2Fuploads%2Fitem%2F201905%2F28%2F20190528143150_fETNW.thumb.700_0.jpeg&refer=http%3A%2F%2Fb-ssl.duitang.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1627126362&t=672b0f0d1de1d293a15002e39a59a1c6" >
    </div>
  </div>
</div>
<tabbar></tabbar>
  </div>
</template>

<script>
import {getInfo} from  '@api'
import tabbar from '@components/tabbar'
  export default {
    data(){
      return{
        userInfo:{}
      }
    },
    created(){
    
      getInfo().then(res=>{
        console.log(this,"center");
        if(res.data.code===200){
        this.userInfo=res.data.data
        }else{
          this.$router.push("/login")
        }
       
      })
    },
    components:{
      tabbar
    }
   
  }
</script>

<style lang="scss" scoped>
.center-conntent{
  width: 100%;
  height: 100vh;
}
.head{
  background: url(https://www.17sucai.com/preview/1527619/2019-04-17/Mon/images/head.png) no-repeat center top;
  background-size: 120%;
  height: 300px;
  width: 100%;
  position: relative;
  padding-top: 40px;
  text-align: center;
  color: #fff;
}
.homepage{
  width: 90%;
 padding: 80px 0 20px;
  position: absolute;
  background: #fff;
 left: 50%;
 transform: translateX(-50%);
 top: 130px;
 border-radius: 10px;
 box-shadow: 0 5px 19px #aaa;
 color:#000;
  img{
    display: block;
    width: 100px;
    height: 100px;
    border-radius: 50%;
    position: absolute;
    top: -50px;
    left: 50%;
    transform: translateX(-50%);
  }
}
</style>